<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<style>
    li{
        width: 30px;
        height: 30px;
        line-height:30px;
        text-align: center;
        background: yellowgreen;
        color: #fff;
        float: left;
        margin-right: 10px;
        list-style:none;
    }
    li:first-child:nth-last-child(4),
    li:first-child:nth-last-child(4)~li
    {
        /*但数量是四个时候，全选*/
        /*background: red;*/
    }
    li:nth-of-type(n+3){
    /*(an+b),当a=1时候n+b表示不管n选择什么值，都会大于b,因此n+b表示选择b以后的所有元素*/
        /*background: red;*/
    }
    li:first-child:nth-last-child(n+4),
    li:first-child:nth-last-child(n+4)~li{
        /*至少四个时候*/
        /*background: red;*/
    }
    li:first-child:nth-last-child(-n+4),
    li:first-child:nth-last-child(-n+4)~li{

        /*background: red;*/
    }
    /*总结*/
    /*:first-child:nth-last-type(n+4),nth-last-type(n+4)~li   这个相当于大于等于号*/
    /*:first-child:nth-last-type(-n+4),nth-last-type(-n+4)~li   这个相当于小于等于号*/
    /*所以*/
    li:first-child:nth-last-child(n+2):nth-last-child(-n+6),
    li:first-child:nth-last-child(n+2):nth-last-child(-n+6)~li{
        background: red;
        /*2<=x<=6*/
    }
</style>
<body>
<ul>
    <li>1</li>
    <li>2</li>
    <li>3</li>
    <li>3</li>
    <li>3</li>
    <li>3</li>
    <li>3</li>
</ul>
</body>
</html>